import React from "react";
import axios from "axios";

// 写一个SPARQL查询文件录入组件
const SparqlQuery: React.FC = () => {
  const textareaRef = React.useRef<HTMLTextAreaElement>(null);

  const handleQuery = () => {
    // 这里写查询逻辑
    if (!textareaRef.current) return;
    const textarea = textareaRef.current;
    let data = {
      query: textarea.value,
    };
    console.log(data);

    axios
      .post("http://127.0.0.1:4000/api/v1/graph/query", data)
      .then((res: any) => {
        console.log(res);
      });
  };
  return (
    <div>
      <div>
        <h1>SPARQL查询</h1>
        <textarea
          ref={textareaRef}
          rows={10}
          cols={50}
          className="border-4 border-dashed"
        />
        <button onClick={handleQuery}>查询</button>
      </div>
      <div className="border-4 border-dashed">
        <h1>查询结果</h1>
        <p>这里显示查询结果</p>
      </div>
    </div>
  );
};

export default SparqlQuery;
